<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=1.0, minimum-scale=1.0, maximum-scale=1.0" />
	<title>个人工单</title>
	<link rel="stylesheet" type="text/css" href="common.css">
</head>
<body class="ordercss" onload="getData()">
	<ul>
		<li class="selected unfinish">未完成</li>
		<li class="finish">已完成</li>
	</ul>

	<div class="container" id="unjob">
		
	</div>

	<div class="container" style="display: none;" id="donejob">
		<!-- <div class="com-list">
			<div class="list-head">
				<label>工单号:2018213540512</label>
				<span>已完成</span>
			</div>
			<div class="list-content">
				<span class="mowrap">工单简述工单简述工单简述工单简述工单简述工单简述工单简述工单简述工单简述工单简述工单简述工单简述工单简述工单简述工单简述工单简述工单简述工单简述工单简述工单简述</span>
			</div>
			<a href="done-detail.html">
				<div class="btngroup">
					<div class="combtn" style="width: 100%;color: #04a3ff;">详情</div>
				</div>
			</a>
		</div> -->
	</div>


	<!-- 底部导航栏 -->
	<div class="bottomfix">
		<a href="list.html"><div class="botbtn" style="border-right: 1px solid #d6d6d6;">工单池</div></a>
		<a href="#"><div class="botbtn" style="border-right: 1px solid #d6d6d6;color: #deaa48;">个人工单</div></a>
		<a href="person.html"><div class="botbtn">个人中心</div></a>
	</div>
	<div class="tips">
		工单完成
	</div>
	<script src="js/jquery-1.8.3.min.js"></script>
	<script src="js/common.js"></script>
	<script type="text/javascript">
		$(function(){
			$("ul li").click(function(){
				$(this).addClass('selected').siblings().removeClass('selected');
				var index = $(this).index();
	            $(".container").hide().eq(index).show();
			})
			
			/* $("body").click(function(event) {
			   if($(event.target).hasClass("grabbtn")){
				 var job_id = $(event.target).attr("data-name");
				 console.log(job_id)
				 $.ajax({
			   			type:"POST",
			   			url:"../Job/finishJob",
			   			data:{job_id:job_id},
			   			contentType : "application/json;charset=UTF-8",
			   			dataType:"Json",
			   			success:function(res){
			   				var info = res.info;
			   				console.log(res)
			   				if(info=="success"){
			   					$(".tips").show();
			   					setInterval(function(){ 
			   						refresh();
			   					}, 2000);
			   				}else{
			   					
			   				}
			   			}
			   		})
			   	}
			}) */
		})

		function refresh(){
		    window.location.reload();//刷新当前页面.
		     
		}
		
		$("body").click(function(event) {
	       	 if($(event.target).hasClass("unfinish")){
	       		 getData();
	       	 }else if($(event.target).hasClass("finish")){
	       		$.ajax({
	    			type:"POST",
	    			url:"../Job/finishallJob",
	    			contentType : "application/json;charset=UTF-8",
	    			dataType:"Json",
	    			success:function(res){
	    				var info = res.info;
	    				console.log(res)
	    				if(info=="success"){
	    					var str = '';
			 	            var data = res.object;
			 	            for (var i = 0, len = data.length; i < len; i++) {
			 	           	 str += '<div class="com-list"><div class="list-head"><label>工单号:'+ data[i].job_id +'</label><span>'+ data[i].job_state +'</span></div>';
			 			 	 str += '<div class="list-content"><span class="mowrap">'+ data[i].detail +'</span></div><div class="btngroup"><a href="done-detail.html?id=' + data[i].job_id + '">';
			 				 str += '<div class="btngroup"><div class="combtn" style="width: 100%;color: #04a3ff;">详情</div></div></a></div></div>';
			 	            }
			 	            $("#donejob").html(str)
	    				}else{
	    					/* <div class="com-list">
	    					<div class="list-head">
	    						<label>工单号:2018213540512</label>
	    						<span>已完成</span>
	    					</div>
	    					<div class="list-content">
	    						<span class="mowrap">工单简述工单简述工单简述工单简述工单简述工单简述工单简述工单简述工单简述工单简述工单简述工单简述工单简述工单简述工单简述工单简述工单简述工单简述工单简述工单简述</span>
	    					</div>
	    					<a href="done-detail.html">
	    						<div class="btngroup">
	    							<div class="combtn" style="width: 100%;color: #04a3ff;">详情</div>
	    						</div>
	    					</a>
	    				</div> */
	    				}
	    			}
	    		})
	       	 }
		})
		
		$.ajax({
			type:"POST",
			url:"../Handle/getHandle",
			contentType : "application/json;charset=UTF-8",
			dataType:"Json",
			success:function(res){
				var info = res.info;
				if(info=="success"){
				}else{
					window.location.href="login.html";
				}
			}
		})
		
		var getData = function(){
			$.ajax({
			 	type:"POST",
			 	url:"../Job/doingJob",
			 	contentType : "application/json;charset=UTF-8",
			 	dataType:"Json",
			 	success:function(res){
			 		var info = res.info;
			 		if(info=="success"){
			 			var str = '';
			 	            var data = res.object;
			 	            for (var i = 0, len = data.length; i < len; i++) {
			 	           	 str += '<div class="com-list"><div class="list-head"><label>工单号:'+ data[i].job_id +'</label><span>'+ data[i].job_state +'</span></div>';
			 			 	 str += '<div class="list-content"><span class="mowrap">'+ data[i].detail +'</span></div><div class="btngroup"><a href="doing-detail.html?id=' + data[i].job_id + '">';
			 				 str += '<div class="combtn" style="border-right: 1px solid #d6d6d6;color: #04a3ff;">详情</div></a><div class="combtn grabbtn" data-name="' + data[i].job_id + '">完成</div></div></div>';
			 	            }
			 	            $("#unjob").html(str)
			 	            $("body").click(function(event) {
							   if($(event.target).hasClass("grabbtn")){
								 var job_id = $(event.target).attr("data-name");
								 console.log(job_id)
								 $.ajax({
							   			type:"POST",
							   			url:"../Job/finishJob",
							   			data:{job_id:job_id},
							   			dataType:"Json",
							   			success:function(res){
							   				var info = res.info;
							   				console.log(res)
							   				if(info=="success"){
							   					$(".tips").show();
							   					setInterval(function(){ 
							   						refresh();
							   					}, 2000);
							   				}else{
							   					
							   				}
							   			}
							   		})
							   	}
							})
			 	           
			 		}else{
			 			var str = '暂无工单';
			 			$("#unjob").html(str)	
			 		}
			 	}
			 })
		}
		
	     
		
	</script>
</body>
</html>